<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>主页</title>
	<link rel="stylesheet" type="text/css" href="<%=basePath %>/modules/lib/ligerUI1.1.0/skins/Aqua/css/ligerui-all.css">
	<style type="text/css">
	    body{ padding:0px; margin:0;   overflow:hidden;}  
	    .l-link{ display:block; height:26px; line-height:26px; padding-left:10px; text-decoration:underline; color:#333;}
	    .l-link2{text-decoration:underline; color:white;}
	    .l-layout-top{background:#102A49; color:White;}
	    .l-layout-bottom{ background:#E5EDEF; text-align:center;}
	    #pageloading{position:absolute; left:0px; top:0px; background:white url('loading.gif') no-repeat center; width:100%; height:100%; height:700px; z-index:99999;}
	    .l-link{ display:block; line-height:22px; height:22px; padding-left:20px;border:1px solid white; margin:4px;}
	    .l-link-over{ background:#FFEEAC; border:1px solid #DB9F00;}
    </style>
	<script type="text/javascript" src="<%=basePath %>/modules/lib/jquery/jquery-1.3.2.min.js"></script>
	<script type="text/javascript" src="<%=basePath %>/modules/lib/ligerUI1.1.0/js/ligerui.all.js"></script>
	
 
	<script type="text/javascript">
		var tab = null;
		var accordion = null;
		var tree = null;
		$(function ()
		{
		    //布局
		    $("#layout").ligerLayout({ leftWidth: 190, height: '100%', onHeightChanged: f_heightChanged });
		
		    var height = $(".l-layout-center").height();
		
		    //Tab
		    $("#framecenter").ligerTab({ height: height });
		
		    //面板
		    $("#accordion_1").ligerAccordion({ height: height - 24, speed: null });
		
		    $(".l-link").hover(function ()
		    {
		        $(this).addClass("l-link-over");
		    }, function ()
		    {
		        $(this).removeClass("l-link-over");
		    });
		    //树
		    $("#tree1").ligerTree({
		        checkbox: false,
		        nodeWidth: 120,
		        attribute: ['nodename', 'url'],
		        onSelect: function (node)
		        {
		            if (!node.data.url) return;
		            var tabid = $(node.target).attr("tabid");
		            if (!tabid)
		            {
		                tabid = new Date().getTime();
		                $(node.target).attr("tabid", tabid)
		            }
		            if ($(">ul >li", tab.tab.links).length >= 4)
		            {
		                var currentTabid = $("li.l-selected", tab.tab.links).attr("tabid"); //当前选择的tabid
		                if (currentTabid == "home") return;
		                tab.overrideTabItem(currentTabid, { tabid: tabid, url: node.data.url, text: node.data.text });
		                return;
		            }
		            f_addTab(tabid, node.data.text, node.data.url);
		        }
		    });
		
		    tab = $("#framecenter").ligerGetTabManager();
		    accordion = $("#accordion_1").ligerGetAccordionManager();
		    tree = $("#tree1").ligerGetTreeManager();
		    $("#pageloading").hide();
		});
		
		function f_heightChanged(options)
		{
		    if (tab)
		        tab.addHeight(options.diff);
		    if (accordion && options.middleHeight - 24 > 0)
		        accordion.setHeight(options.middleHeight - 24);
		}
		function f_addTab(tabid,text, url)
		{ 
		    tab.addTabItem({ tabid : tabid,text: text, url: url });
		}
		
		
	</script>
  </head>
  
  <body style="padding:0px;">
	<div id="pageloading"></div>
  	<div id="layout" style="width:100%">
        <div position="top" style="background:#102A49; color:White; ">
            <div style="margin-top:6px; margin-left:16px"><font size="6">耕地质量监测预警系统</font></div>
        </div>
        <div position="left"  title="主要菜单" id="accordion_1"> 
        	<div title="功能列表" class="l-scroll">
	            <ul id="tree1" style="margin-top:3px;">
	               <li isexpand="false"><span>Example</span>
	                   <ul> 
	                   <li url="<%=basePath %>/example/query-example.jsp"><span>example</span></li>
	                   <li url="http://www.google.com.hk"><span>用户查询</span></li>
	                   <li url="<%=basePath %>modules/sys/user/sys.user-main.jsp"><span>按钮</span></li>
	                   <li url="http://www.cnblogs.com/leoxie2011"><span>帮助</span></li>
	               	</ul>
	               	</li>
	               <li isexpand="false"><span>弹窗</span>
	                <ul>
	                    <li url="demos/dialog/dialogAll.htm"><span>弹出框</span></li>
	                    <li url="demos/dialog/dialogTarget.htm"><span>载入目标DIV</span></li>
	                    <li url="demos/dialog/dialogUrl.htm"><span>窗口</span></li> 
	                </ul>
	               </li>
	            </ul>
            </div>
            <div title="应用场景">
            	<div style=" height:7px;"></div>
                <a class="l-link" href="javascript:f_addTab('listpage','列表页面','demos/case/listpage.htm')">列表页面</a> 
            </div>    
        </div>
        <div position="center" id="framecenter"> 
            <div tabid="home" title="我的主页" style="height:300px" >
                <iframe frameborder="0" name="home" src="http://www.baidu.com"></iframe>
            </div> 
        </div> 
        <div position="bottom" style="padding-top:6px;">
            Copyright © 2011 caiwd<br/>
            e-mail:caiwd_wx2011@163.com
        </div>
    </div> 
    <div style="display:none">
    	<!-- 流量统计代码 --> 
    </div>
  </body>
</html>
